{extend name="common/layout" /}
{block name="style"}
<style>
    .media .media-body .media-heading {
    }

    .media .media-body p {
        line-height: 2em;
    }

    .item {
        float: left;
    }

    .price {
        display: inline-block;
        margin-right: 10px;
    }
    .item .thumbnail:hover{
        border: 1px solid #ccc;
        box-shadow: 0 4px 8px 0 rgba(0,0,0, 0.6);
        box-sizing: border-box;
    }
</style>
{/block}
{block name="main"}
<div class="container content-wrap">
    <div class="row">
        <main class="col-md-8 main-content">
            <ol class="breadcrumb crumb">
                <li><a href="/">首页</a></li>
                <li><a href="/">店铺</a></li>
                <li class="active">{$title}</li>
            </ol>


            <div class="row masonry">
                {if $list}
                {volist name="list" id="vo"}
                <div class="col-xs-6 col-md-4 item">
                    <a href="{:url('@index/shopping/item', 'id='.$vo.id)}" style="display:inline-block;">
                        <div class="thumbnail">
                            <img src="{$vo.pict_url}" alt="{$vo.title}" class="lazy">
                            <div class="caption">
                                <h3 class="price">￥{$vo.zk_final_price}</h3>
                                {if $vo.zk_final_price < $vo.reserve_price}
                                <del>￥{$vo.reserve_price}</del>
                                {/if}
                                <p>{$vo.title}</p>
                            </div>
                        </div>
                    </a>
                </div>
                {/volist}
                {else}
                <div class="media post-list">
                    <center style="height: 100px; line-height: 100px; font-size: 2em;">未找到"{$title}"</center>
                </div>
                {/if}
            </div>


            {if $page}
            <nav aria-label="">
                {$page}
            </nav>
            {/if}

        </main>
        <sidebar class="col-md-4 sidebar">
            <div class="widget">
                <h4 class="title">店铺信息</h4>
                <div class="content community">
                    <span class="row">店铺名称：{$shop->shop_title}</span>
                    <span class="row">卖家昵称：{$shop->nick}</span>
                    <span class="row">卖家ID&nbsp;：{$shop->seller_id}</span>
                    <span class="row">地&nbsp;&nbsp;&nbsp;&nbsp;址：{$shop->provcity}</span>
                </div>
            </div>
        </sidebar>
    </div>
</div>

{/block}
{block name="js"}
<script src="__PUBLIC__/others/imagesloaded.pkgd.min.js"></script>
<script src="__PUBLIC__/others/masonry.pkgd.min.js"></script>
<script>
    $(document).ready(function () {
        var container = $('.masonry');

        container.imagesLoaded(function () {
            $('.masonry').masonry({
                itemSelector: '.item',
                isAnimated: true,
            });
        });

    });
</script>
{/block}